<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8" />
	<title>Tab Demos</title>
	
	<script src="../../../../scripts/jquery.js" type="text/javascript"></script>
	
	<script src="../../../../scripts/jquery_ui/jquery.ui.core.js" type="text/javascript" ></script>
	<script src="../../../../scripts/jquery_ui/jquery.ui.widget.js" type="text/javascript" ></script>
	
	<link  href="../../../../themes/default/ui.css" type="text/css" rel="stylesheet" />
	
	<script src="../jquery.ui.tabs.js" type="text/javascript"></script>
	<link  href="../jquery.ui.tabs.css" rel="stylesheet" type="text/css" />
		
	<link type="text/css" href="../../../demos.css" rel="stylesheet" />
<!-- 换肤 -->
	<script type="text/javascript" src="../../../theme_cookie.js"></script>
	<script>
	Global = {contextPath:'/bingo.framework.project'} ;
	$( function(){
		var $tabs = $('#tabs-below').tabs({
			closable:true,
			tabs:[
				{label:'tab1',iframe:true,url:"http://www.g.cn",id:'123'},
				{label:'tab2',iframe:true,url:"http://www.g.cn",id:'124'}
			],
			add: function(event, ui) {
				//callback
			},
			height:'300px',
			select: function(event, ui) { 
						alert(ui.panel.id);
				}
		});

		//添加tab也控制区域
		var $tab_title_input = $('#tab-title'), $tab_content_input = $('#tab-content');
		var tab_counter = 3 ;
		
		$('#add').click( function(){
			var tab_content = $tab_content_input.val() || 'Tab '+tab_counter+' content.';
			var tab_title = $tab_title_input.val() || 'Tab '+tab_counter;
			$('#tabs-below').tabs().add({
				url: "$http://www.sogou.com",
				label:"sdfasdf",
				cache:true,
				id:"newTab0"
			});//'#tabs-add-'+tab_counter, tab_title,tab_content
			tab_counter++;
		} ) ;
	} );
	</script>
</head>

<body>
	
	tab标题：<input type='text' id='tab-title'> 
	tab内容：<input type='text' id='tab-content'> &nbsp;&nbsp;&nbsp;  <a href="javascript:void(0)" id='add'>创建tab</a>
	<br /><br />

	<div id="tabs-below">
		
	</div>

</body>
</html>